<template>
    <div>
        <div class="praise" v-for='item in list'>
            <router-view></router-view>
            <div class="praise-top">

                    <img :src=item.icon_url alt="">
                    <b>{{item.name}}</b>
                    <p>{{item.publish_time}}</p>

            </div>
            <div class="praise-bottom">
                <p>{{item.commont}}</p>
                
            </div>
        </div>
    </div>
    
</template>
<script>
export default {
    props:['list']
}
</script>

<style lang="stylus" scoped>
@import '~@/assets/stylus/border.styl'
.praise
    display flex
    // height  1rem
    width 100%
    flex-direction column
    .praise-top
        // flex 12
        display flex
        height .6rem 
        width 100%
        padding-left .1rem
        align-items center
        img 
            // padding 0 .05rem
            width .4rem
            height .4rem
            border-radius .4rem
        b
            flex 1
            padding-left .1rem
            line-height .7rem
            font-size .16rem
        p
            width 1.5rem 
            font-size .14rem
            line-height .7rem
            text-align right
            padding 0 .1rem 0 0 
            color #666  
    .praise-bottom
        // flex 4
        p
            margin 0 .15rem
            padding-bottom .1rem
            // height .3rem
            // line-height .14rem
            font-size .14rem
            border_1px(0 0 1px 0)
            color #666
</style>

